
<extend name="Application/Admin/View/head.html" />
		<block name="conten">

					<div class="row">
						<div class="col-lg-6 col-md-12 col-sm-12 col-xs-12">
							<div class="panel panel-default bk-bg-white">
								<div class="panel-heading bk-bg-white">
									<h6><i class="fa fa-indent red"></i>角色添加</h6>							
									<div class="panel-actions">
										<a href="#" class="btn-minimize"><i class="fa fa-caret-up"></i></a>
										<a href="#" class="btn-close"><i class="fa fa-times"></i></a>
									</div>
								</div>
								<div class="panel-body">
									<form action="" method="post" enctype="multipart/form-data" class="form-horizontal " id="signupForm">

									<div class="form-group">
											<label class="col-md-3 control-label" for="text-input">角色名：</label>
											<div class="col-md-9">
												<input type="text" id="text-input" name="title" class="form-control" placeholder="请输入角色名">
											</div>
										</div>
												<!-- 父级循环 -->
									<foreach name="top_rule" item="v" >
										<div class="col-md-9">
											<div class="checkbox-custom checkbox-inline">
												<input class="parent" type="checkbox" value="{$v.id}" name="rules[]" id="inline-checkbox{$v.id}" class="top"> 
												<label for="inline-checkbox{$ve.id}">{$v['title']}</label>
											</div>
											
										
											</div>
									
									<div class="col-md-9">	
											<!-- 子级循环 -->
									<foreach name="chind_rule" item="ve">

									<eq name="ve['pid']" value="$v['id']">
											<div class="checkbox-custom checkbox-inline">
												<input class="child" type="checkbox" value="{$ve['id']}" name="rules[]" id="inline-checkbox{$ve['pid']}"> 
												<label for="inline-checkbox{$ve['pid']}">{$ve['title']}</label>

											</div>
											</eq>
										</foreach>
											</div>
										</foreach>
											</div>
									
										
										</div>
										
											<div class="col-sm-4 text-right">
													<button type="submit" class="btn btn-primary hidden-xs">提交</button>
													
												</div>

												<div class="col-sm-4 text-right">
													<button type="button" class="btn btn-primary hidden-xs whole ">全选</button>
													
												</div>
										
										<br>
									</form>
								</div>								
							</div>

							 
						</div>
						<script src="__ADMIN__/assets/vendor/js/jquery.min.js"></script>

		<script src="__ADMIN__/assets/vendor/js/jquery-2.1.1.min.js"></script>

		<script src="__ADMIN__/assets/vendor/js/jquery-migrate-1.2.1.min.js"></script>
		<script src="__ADMIN__/assets/vendor/bootstrap/js/bootstrap.min.js"></script>
		<script src="__ADMIN__/assets/vendor/skycons/js/skycons.js"></script>	
		<script src="__ADMIN__/assets/vendor/js/pace.min.js"></script>
		
		<!-- Plugins JS-->
		<script src="__ADMIN__/assets/plugins/jquery-ui/js/jquery-ui-1.10.4.min.js"></script>
		<script src="__ADMIN__/assets/plugins/touchpunch/js/jquery.ui.touch-punch.min.js"></script>		
		<script src="__ADMIN__/assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
		<script src="__ADMIN__/assets/plugins/bootstrap-timepicker/js/bootstrap-timepicker.js"></script>
		<script src="__ADMIN__/assets/plugins/bootstrap-colorpicker/js/bootstrap-colorpicker.js"></script>
		<script src="__ADMIN__/assets/plugins/bootstrap-tagsinput/js/bootstrap-tagsinput.js"></script>
		<script src="__ADMIN__/assets/plugins/maskedinput/js/jquery.maskedinput.js"></script>
		<script src="__ADMIN__/assets/plugins/sparkline/js/jquery.sparkline.min.js"></script>
		
		<!-- Theme JS -->		
		<script src="__ADMIN__/assets/js/jquery.mmenu.min.js"></script>
		<script src="__ADMIN__/assets/js/core.min.js"></script>
		<!-- Pages JS -->
		<script src="__ADMIN__/assets/js/pages/form-elements.js"></script>
		
					
		
	</block>
		<block name="js">		<!-- 表单验证引入 -->
		<script src="__ADMIN__/assets/js/jquery.validate.min.js"></script>	


<script type="text/javascript">
		$(function(){
			//全选
			$('.whole').click(function(){
				$(':checkbox').prop('checked',true);
			})
			//重置
			$('.reset').click(function(){
				$(':checkbox').prop('checked',false);
			})
			//点击父级，选中子级
			$('.parent').click(function(){
				//勾选父级，选中子级，否则相反
				//$(this).is(':checked')判断当前是否存在某属性，存在返回true否则返回false
				if($(this).is(':checked')){
					$(this).parent().parent().next().find(':checkbox').prop('checked',true);
				}else{
					$(this).parent().parent().next().find(':checkbox').prop('checked',false);
				}
			})
			//点击子级选中父级
			$('.child').click(function(){
				var child = $(this).parent().parent().find(':checkbox:checked').length;
				var parent = $(this).parent().parent().prev().find('.parent');	
				if(child>0){
					parent.prop('checked',true);
				}else{
					parent.prop('checked',false);
				}
			})
		})
	</script>

	<!-- 	<script type="text/javascript">
		$(function(){
			$('.btn_all').click(function(){		//全选
				$(':checkbox').prop('checked',true);		
			})
			//点父级子级选中
			$('.top').click(function(){
				if($(this).is(':checked')){
					$(this).parent().parent().prve().find(':checkbox').prop('checked',true);
				}else{ 
					$(this).parent().parent().prve().find(':checkbox').prop('checked',false);
				}
				
			})
			//点子级父级选中
			$(':checkbox').click(function(){
			 var len = $(this).parent().parent().find('input:checked').length;

			 if(len>0){
					$(this).parent().parent().prve().find(':checkbox').prop('checked',true);
			 }else{
			 		$(this).parent().parent().prve().find(':checkbox').prop('checked',false);
			 }
			})
			
		})
		</script> -->
		</block>